<template>
  <div class="mainDiv">
    <!-- 卡片统计 -->
    <el-row type="flex" justify="start" :gutter="10">
      <el-col :span="8">
        <el-card class="index-card" shadow="hover">
          <div slot="header" class="clearfix">
            <span class="card_text">个人信息</span>
            <el-button style="float: right; padding: 3px 0" type="text"
              >详情</el-button
            >
          </div>
          <el-row type="flex" justify="space-around">
            <el-col :span="6"><p class="index_self_info_p">姓名</p></el-col>
            <el-col :span="6"><p class="index_p">姓名</p></el-col>
          </el-row>
          <el-row type="flex" justify="space-around">
            <el-col :span="6"><p class="index_self_info_p">身份</p></el-col>
            <el-col :span="6"><p class="index_p">身份</p></el-col>
          </el-row>
          <el-row type="flex" justify="space-around">
            <el-col :span="6"><p class="index_self_info_p">会员类别</p></el-col>
            <el-col :span="6"><p class="index_p">会员类别</p></el-col>
          </el-row>
          <el-row type="flex" justify="space-around">
            <el-col :span="6"><p class="index_self_info_p">到期时间</p></el-col>
            <el-col :span="6"><p class="index_p">到期时间</p></el-col>
          </el-row>
          <el-row type="flex" justify="space-around">
            <el-col :span="6"><p class="index_self_info_p">会员类别</p></el-col>
            <el-col :span="6"><p class="index_p">会员类别</p></el-col>
          </el-row>
        </el-card>
      </el-col>
      <el-col :span="8">
        <el-card class="index-card" shadow="hover">
          <div slot="header" class="clearfix">
            <span class="card_text">相关赛事信息</span>
            <el-button style="float: right; padding: 3px 0" type="text"
              >详情</el-button
            >

          </div>

          <el-row>
            <el-col :span="5"> 1</el-col>
          </el-row>
        </el-card>
      </el-col>
      <el-col :span="8">
        <el-card class="index-card" shadow="hover">
          <div slot="header" class="clearfix">
            <span class="card_text">相关定级信息</span>
            <el-button style="float: right; padding: 3px 0" type="text"
              >详情</el-button
            >
          </div>
        </el-card>
      </el-col>
    </el-row>
    <!-- 图表统计 -->
  </div>
</template>

<script>
export default {
  data() {
    return {
      adminIndexFunction: [],
      num: 100,
    };
  },
  methods: {},
  mounted() {},
};
</script>

<style lang="scss" scoped>
.index-card {
  margin: 7%;
  border-radius: 10px;
}
.card_text {
  // margin-left: 13%;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  font-size: 14px;
}
.index_self_info_p {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: 100;
  display: inline-block;
  width: 5em;
  text-align: justify;
  text-align-last: justify;
}
</style>
